.order-nav{
  position:fixed;
  top:60px;
  left:0;
  right:0;
  padding-left:14px;
  padding-right:14px;
  background:#fff;
  z-index:5;
  height:4rem;
  >ul {
    margin:0;
    > li {
      float: left;
      display: inline;
      > a {
        width: auto;
        height: 100%;
        padding:1rem 0.3rem;
        font-size: 1.6rem;
        font-weight:500;
        color: #202020;
      }
      >a:hover,>a>.active{
        color:#38adff;
        border-bottom: 3px solid #38adff;
      }
    }
  }
}
.order-state{
  height:6rem;
  padding-top:1.6rem;
  padding-left:0.5rem;
  >div{
    display:inline-block;
    float:left;
  }
  >.round{
    width:40px;
    height:40px;
    background:#ffaa0c;
    border-radius: 20px;
    text-align: center;
    padding-top: 4px;
    >span{
      color:#fff;
      font-size:30px;
    }
  }
  >.round2{
    width:40px;
    height:40px;
    background:#c3c3c3;
    border-radius: 20px;
    text-align: center;
    padding-top: 4px;
    >img{
      width:28px;
      margin-top:3px;
    }
  }
  >.round3{
    width:40px;
    height:40px;
    background:#38adff;
    border-radius: 20px;
    text-align: center;
    padding-top: 4px;
    >img{
      width:18px;
      margin-top:3px;
    }
  }
  >.font{
    font-size:1.8rem;
    font-weight: bold;
    >span{
      display: inline-block;
      margin-top:5px;
      padding-left:10px;
    }
  }
  >.font-o{ color:#ff6000; }
  >.font-b{ color:#333; }
}
.border-top{
  width:100%;
  height:0;
  border-top:1px solid #e5e5e5;
  padding:0 10px 0 10px;
}
.box-s{
  position:fixed;
  top:108px;
  z-index:5;
  -webkit-box-shadow:5px 5px 5px #eefaff;
  -moz-box-shadow:5px 5px 5px #eefaff;
  box-shadow:5px 5px 5px #eefaff;
}
.order-info{
  padding:0.5rem 0 0.5rem 0;
  >.d1{
    display: inline-block;
    width:40px;
    height:50px;
    text-align: center;
    padding-top:10px;
    float:left;
    span{
      color:#38adff;
      font-size:30px;
    }
  }
  >.u1{
    float:left;
    >li{
      display: inline-block;
      float:left;
      color:#333;
      font-size:1.4rem;
      padding:0.3rem 0.5rem 0.3rem 0.3rem;
    }
    >.font-s{
      font-size:1.2rem;
      color:#797979;
    }
  }
  >.u2{
    padding-top:10px;
    padding-bottom: 10px;
    >li{
      float:left;
      width:50%;
      padding-left:10px;
      padding-right:10px;
    }
  }
  >.u3{
    padding-top:10px;
    padding-bottom: 10px;
    >li{
      padding:2px 10px 2px 10px;
    }
  }
  >.u4{
    padding-top:10px;
    padding-bottom: 10px;
    >li{
      float:left;
      padding-left:10px;
      padding-right:10px;
      >.u4-d1{
        display: inline-block;
        float:left;
        >span{
          padding-left:5px;
        }
        >.u4-s1{
          display:inline-block;
          width:100%;
          font-size:10px;
          color:#868686;
        }
      }
      >.u4-input{
        width:30px;
        height:30px;
        border:1px solid #9fa3b6;
        border-radius:50%;
        text-align: center;
        padding-top:3px;
        span{
          color:#fff;
          font-size:16px;
          z-index: 100;
        }
        >.u4-i1{
          visibility: hidden;
        }
      }
      >.on-checked{
        background:#38adff;
      }
    }
  }
}
.order-top{
  height:3rem;
  border-bottom: 1px solid #e5e5e5;
  >ul{
    >li{
      height:3rem;
      >b{
        display:inline-block;
        width:20px;
        height:20px;
        background:#c3c3c3;
        border-radius:50%;
      }
      >a{
        >span{
          display: inline-block;
          height:100%;
          font-size: 1.4rem;
          font-weight: bold;
          color:#333;
        }
      }
      >.paying{color:#ff6000;}
      >.sent{color:#333;}
    }
  }
}
.order-body{
  border-bottom: 1px solid #e5e5e5;
  a{
    display: inline-block;
    width:100%;
    height:100%;
    span{
      display: inline-block;
      font-size: 1.6rem;
    }
    .span-b{
      margin-top:2rem;
      width:100%;
      color:#333;
    }
    .span-o{
      margin-top:1rem;
      color:#ff5e00;
    }
    .span-g{
      margin-top:1rem;
      color:#c3c3c3;
    }
  }
}
.order-foot{
  >ul{
    height:3rem;
    text-align: right;
    margin:10px 10px 0 0;
    >li{
      float:right;
    }
  }
  >div{
    text-align: right;
    margin: 1rem 1rem 2rem 0;
  }
}
.order-foot-detail{
  border-bottom: 1px solid #e5e5e5;
  >ul{
    height:3rem;
    margin:10px 10px 0 0;
    >li{
      width:50%;
      float:left;
      padding-left:10px;
      padding-right:10px;
    }
  }
  >div{
    text-align: right;
    margin: 1rem 1rem 2rem 0;
  }
}
.bottom-1{
  height:4rem;
  text-align: center;
  color:#cbcbcb;
  padding-top: 1.5rem;
}
.order-u{
  >li{
    float:left;
    width:50%;
    >span{
      font-size:18px;
      display:inline-block;
      height:40px;
      padding-top:5px;
    }
    >a{
      display:inline-block;
      width:120px;
      height:40px;
      font-size:18px;
    }
  }
}
footer{
  position: fixed;
  left: 0;
  bottom: 0;
  width: 100%;
  height: 6rem;
  background: #fff;
  z-index: 108;
}
.dian{
  display: inline-block;
  text-align: center;
  >div{
    height:10px;
  }
  span{
    width:0;
    height:0;
    border:3px solid #fff;
    display:inline-block;
  }
}
.top-bar{
  position:fixed;
  top:0;
  left:0;
  z-index:100;
  height:5rem;
  width:100%;
  background: #5abbfe;
  padding:0 0.5rem;
  text-align: center;
  .font-white{
    padding-top:16px;
    color:#fff;
    font-size:20px;
  }
  >div{
    float:left;
    padding-top:10px;
    input{
      height:3rem;
      width:80%;
      padding-left:33px;
      color:#83cbff;
      border-radius: 4px;
      outline: none;
      border:1px solid #fff;
      background: #fff url("../../images/v2/search-top.png") -2% center no-repeat;
    }
    ::-webkit-input-placeholder { /* WebKit browsers */
      color:#83cbff;
    }
    :-moz-placeholder { /* Mozilla Firefox 4 to 18 */
      color:#83cbff;
    }
    ::-moz-placeholder { /* Mozilla Firefox 19+ */
      color:#83cbff;
    }
    :-ms-input-placeholder { /* Internet Explorer 10+ */
      color:#83cbff;
    }
  }
  >.down{
    position:fixed;
    padding:0;
    right:0;
    top:60px;
    width:120px;
    height:120px;
    background: #5abbfe;
    z-index:200;
    a{
      color:#fff;
      font-size:18px;
      display: inline-block;
      width:100%;
      height:100%;
      padding:16px 3px;
    }
    .a1{
      border-top:1px solid #fff;
      background: url("../../images/v2/home_03.png") 3% center no-repeat;
    }
    .a2{
      border-top:1px solid #fff;
      background: url("../../images/v2/user_06.png") 3% center no-repeat;
    }
    .a3{
      border-top:1px solid #fff;
      background: url("../../images/v2/shop-car3.png") 4% center no-repeat;
      background-size:18px;
    }
  }
}
.sp{
  margin-top:109px;
  >.sp-list{
    >li{
      border:1px solid #eaeaea;
      box-shadow: 3px 3px 3px 3px #eaeaea;
      width:46%;
      margin-top:10px;
      margin-bottom:10px;
      >img{
        max-width: 90%;
      }
      .p1,.p2{
        color:#373737;
        font-size: 1.8rem;
        b{
          color:#f93b3b;
          padding-right:8px;
        }
        span{
          color:#696969;
        }
      }
      .p1{
        padding:0 8px 0 16px;
      }
      .p2{
        padding:0 16px 0 8px;
      }
    }
  }
}
.add-item{
  display: inline-block;
  z-index: 100;
  width:45px;
  height:42px;
  position:fixed;
  right:20px;
  bottom:100px;
  background:url("../../images/v2/add-item.png") center no-repeat;
  border-radius:50%;
}
.adress{
  background:#fff;
  border:1px solid #dddddd;
  margin-top:10px;
  padding:2px 10px;
  >.a1{
    display: inline-block;
    width:100%;
    color:#38adff;
    >div{
      float:left;
      p{
        padding:5px 0 0 10px;
        margin:0;
      }
    }
  }
  >div{
    float:left;
    a{
      display:inline-block;
      width:80px;
      color:#BABBBC;
    }
  }
}
.adress2,.adress3{
  border:1px solid #ddd;
  background:#fff;
  >div{
    float: left;
    padding-top:5px;
  }
  >.w80{
    padding-left:15px;
    padding-top:3px;
    >span{
      padding-right:10px;
    }
    .input-style{
      outline: none;
      border:1px solid transparent;
      width:100%;
    }
    select{
      outline: none;
      border:1px solid #ddd;
      border-radius: 4px;
      color:#A9ABAB;
    }
  }
}
.adress2{
  height:3rem;
}
.adress3{
  min-height:3rem;
}
.btn-sz{
  text-align: center;
  padding-top:15px;
  border-top:1px solid #ddd;
}
.f16{
  font-size:16px;
}
.f14{
  font-size:14px;
}
.f12{
  font-size:12px;
}
.main{
  margin-top:60px;
  padding-top:20px;
  >ul{
    padding-bottom:15px;
    border-bottom:1px solid #e5e5e5;
    li{
      float:left;
      .pic1{
        width:90px;
        border-radius: 50%;
        margin-left:30px;
      }
      .p-font1{
        margin-top:10px;
        padding-left:30px;
        color:#48b3ff;
        font-size:20px;
      }
      .p-font2{
        padding-left:30px;
        color:#999999;
        font-size:12px;
      }
    }
    .gr-bg1{
      background:url("../../images/v2/gr-bg1.png") right center no-repeat;
      background-size:30px;
    }
    .height{
      height:30px;
      line-height: 30px;
    }
  }
  .gr-list{
    padding-top: 10px;
    padding-bottom: 0;
    margin-bottom:0;
    >li{
      position:relative;
      text-align: center;
      >img{
        width:40px;
      }
      >p{
        color:#333333;
        font-size:16px;
      }
      >span{
        position:absolute;
        top:-5px;
        right:30%;
        display: inline-block;
        width:18px;
        height:18px;
        border:1px solid #ff6000;
        border-radius: 50%;
        color:#ff6000;
        background: #fff;
        z-index: 5;
      }
    }
  }
}
.kong{
  width:100%;
  height:40px;

}
.bottom{
  .gr-btm{
    border-bottom:1px solid #e5e5e5;
  }
  >a{
    display: inline-block;
    padding-top:10px;
    padding-bottom:10px;
    border-top:1px solid #e5e5e5;
    width:100%;
    color:#333333;
    >.gr-list2{
      >div{
        float:left;
        .p-font2{
          padding-left:30px;
          color:#999999;
          font-size:12px;
        }
      }
      .gr-bg2{
        background:url("../../images/v2/icon.png") right center no-repeat;
        background-size:30px;
      }
      .gr-bg3{
        background:url("../../images/v2/collect.png") right center no-repeat;
        background-size:30px;
      }
      .gr-bg4{
        background:url("../../images/v2/location.png") right center no-repeat;
        background-size:30px;
      }
      .gr-bg5{
        background:url("../../images/v2/kefu.png") right center no-repeat;
        background-size:30px;
      }
      .height{
        height:30px;
        line-height: 30px;
      }
    }
  }
}